<script setup lang='ts'>

import { ref } from 'vue'
import Child from './14_父子通信中的子组件.vue'
const username = ref('张三')
const age = ref(18)

const changeInfo = () => {
    username.value = '李四',
        age.value++
}

const receiveFunc = (count: number) => {
    age.value = count
}

const receiveNameFunc = (name: string) => {
    username.value = name
}
const receiveAllFunc = (count: number, name: string) => {
    age.value = count
    username.value = name
}
</script>

<template>
    <div class="parent">
        <h1>当前的父组件</h1>
        <p>姓名：{{ username }}</p>
        <p>年龄：{{ age }}</p>
        <button @click="changeInfo">修改</button>
        <Child :name="username" :age="age" :func="receiveFunc" @updata-age="receiveFunc" @updata-name="receiveNameFunc"
            @updata-all="receiveAllFunc">
        </Child>
    </div>
</template>

<style scoped></style>